<template>
  <van-tabbar v-model="active" v-if="!$route.meta.keepAlive">
    <van-tabbar-item replace to="/home">
      <span>首页</span>
      <template #icon="props">
        <img :src="props.active ? index.active : index.inactive" />
      </template>
    </van-tabbar-item>
    <van-tabbar-item replace to="/upload">
      <span>上传</span>
      <template #icon="props">
        <img :src="props.active ? upload.active : upload.inactive" />
      </template>
    </van-tabbar-item>
    <van-tabbar-item replace to="/mine">
      <span>我的</span>
      <template #icon="props">
        <img :src="props.active ? mine.active : mine.inactive" />
      </template>
    </van-tabbar-item>
  </van-tabbar>
</template>

<script>
export default {
  data() {
    return {
      active: 0,
      index: {
        active: require("@/assets/img/index_active.png"),
        inactive: require("@/assets/img/index.png"),
      },
      upload: {
        active: require("@/assets/img/upload_active.png"),
        inactive: require("@/assets/img/upload.png"),
      },
      mine: {
        active: require("@/assets/img/mime_active.png"),
        inactive: require("@/assets/img/mime.png"),
      },
    };
  },
};
</script>

<style>
</style>